/* 搜索框组件
 * 2016-8-18
 */
AI.Serach = Event.$extend({
	defaultOptions : {
		containerId : 'serach-container',
		dropdownValue : ai.getJsonStore("SELECT OBJTYPE,OBJNAME FROM metaobjmodel order by ordseq").root,
		dropdownTpl : '<li><a href="javascript:void(0);" data-objtype="<%=OBJTYPE%>"><%=OBJNAME%></a></li>',
		hotwordValue : ["热点词1","热点词2","热点词3"],
		hotwordTpl : '<a href="javascript:void(0);"><%=hotwordValue%></a>',
		showHotword : true,
		//clickFunc :,
		cardTpl:
			'<div class="search-wrap">' +
				'<div class="dropdown fl hide">' +
					'<button class="btn btn-default dropdown-toggle" type="button" id="dropdown-default" data-toggle="dropdown" data-objtype="meta" >' +
						'<span>数据类型</span>' +
						'<span class="caret"></span>' +
					'</button>' +
					'<ul class="dropdown-menu" aria-labelledby="dropdown-default" id="serach-dropdown-ul">' +
					'</ul>' +
				'</div>' +
				'<div class="search-combobox fl">' +
					'<input type="text" id="keyword" class="form-control" placeholder="请输入你想搜索的内容">' +
				'</div>' +
				'<div class="search-button fl">' +
					'<button type="button" id="keywordsearch" class="btn btn-info"><i class="fa fa-search"></i></button>' +
				'</div><br>' +
				'<div class="search-hotword" id="search-hotword-ul">' +
				'</div>' +
				'<div class="clear-float"></div>' +
			'</div>',
	},
	__init__:function(options){
		this.config= $.extend(false, this.defaultOptions, options);
		if($("#" + this.config.containerId).length == 0){
				$("body").append('<div id="' + this.defaultOptions.containerId + '"> </div>')
		}
		this.control = $("#" + this.config.containerId);
		this.create();
	},
	create:function(){
		this.control.append(this.config.cardTpl);
		var appendHtml = "";
		for(var i = 0; i < this.config.dropdownValue.length; i++){
			appendHtml += _.template(this.config.dropdownTpl)(this.config.dropdownValue[i]);
		}
		$("#serach-dropdown-ul").html(appendHtml);
		appendHtml = "";
		if(this.config.showHotword){
			for(var i = 0; i < this.config.hotwordValue.length; i++){
				appendHtml += _.template(this.config.hotwordTpl)({hotwordValue:this.config.hotwordValue[i]});
			}
			$("#search-hotword-ul").html(appendHtml);
		}
		this.callback();
	},
	callback:function(){
		if(this.config.clickFunc){
			var clickFunc = this.config.clickFunc;
			$("#keywordsearch").click(function(){
				clickFunc();
			});
			$("#keyword").keydown(function(evt){
				var e=evt||window.event;
				var _keycode=e.keyCode||e.which;
				if(_keycode == 13) clickFunc();
			});
		}
		if(this.config.callback) this.config.callback()
		this.buildEvent();
	},
	buildEvent:function(){
		$(".search-wrap .dropdown").hover(
			function(){
				$("#serach-dropdown-ul").show();
			}, function(){
				$("#serach-dropdown-ul").hide();
		});
		$(".search-wrap .dropdown-menu a").click(function(){
			var _aText = $("#dropdown-default").children().first().html();
			var _aValue = $("#dropdown-default").attr("data-objtype");
			$("#dropdown-default").children().first().html($(this).html());
			$("#dropdown-default").attr("data-objtype", $(this).attr("data-objtype"));
			$(this).html(_aText);
			$(this).attr("data-objtype",_aValue);
			$("#serach-dropdown-ul").hide();
		});
		$(".search-hotword a").click(function(){
			$(".search-combobox input").val($(this).html());
		})
	},
	reset:function(){
		this.control.empty();
		this.create();
	}
});